const path = require("path");
const Webpack = require("webpack");

const VueLoaderPlugin = require("vue-loader/lib/plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");

const AutoprefixerPlugin = require("autoprefixer");
const postCssPluginsOptions = [
    AutoprefixerPlugin({
        browsers: ["last 5 versions"]
    })
];

module.exports = {
    mode: "development",
    devServer: {
        port: 8089,
        host: "localhost",
        overlay: {
            errors: true
        },
        hot: true,
		proxy: {
			"/api": {
                // target: "http://ljhs.tiyanclub.com",
                // target: "http://lj.hbweipai.com",
                target:'http://192.168.1.50:9011',
                // target: "http://192.168.8.100/",
				// target: "http://lajihuishou.hbweipai.com/",
                // target: "http://ljhs.tiyanclub.com/",
                secure: false,
				changeOrigin: true
            }
		}
    },
    devtool: "cheap-eval-source-map",
    entry: path.join(__dirname, "../src/main.js"),
    output: {
        path: path.join(__dirname, "dist"),
        filename: "[name].[hash:8].js"
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: "vue-loader"
            },
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                loader: "babel-loader"
            },
            {
                test: /\.css$/,
                use: [
                    "vue-style-loader",
                    {
                        loader: "css-loader",
                        options: {
                            importLoaders: 1
                        }
                    },
                    {
                        loader: "postcss-loader",
                        options: {
                            ident: "postcss",
                            plugins: postCssPluginsOptions
                        }
                    }
                ]
            },
            {
                test: /\.scss$/,
                use: [
                    "vue-style-loader",
                    "css-loader",
                    {
                        loader: "postcss-loader",
                        options: {
                            sourceMap: true,
                            ident: "postcss",
                            plugins: postCssPluginsOptions
                        }
                    },
                    "sass-loader"
                ]
            },
            {
                test: /\.sass$/,
                use: [
                    "vue-style-loader",
                    "css-loader",
                    {
                        loader: "postcss-loader",
                        options: {
                            sourceMap: true,
                            ident: "postcss",
                            plugins: postCssPluginsOptions
                        }
                    },
                    {
                        loader: "sass-loader",
                        options: {
                            indentedSyntax: true
                        }
                    }
                ]
            },
            {
                test: /\.(gif|jpg|jpeg|png|svg)$/i,
                loader: "url-loader",
                options: {
                    // 当文件大小小于 limit byte 时会把图片转换为 base64 编码，否则返回普通的图片
                    limit: 8192,
                    name: "images/[name]-[hash:8].[ext]"
                }
            },
            {
                test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
                loader: "url-loader",
                options: {
                    limit: 10000,
                    name: "fonts/[name].[hash:8].[ext]"
                }
            }
        ]
    },
    plugins: [
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({
            filename: "index.html",
            template: "configs/template/index.html",
            inject: "body"
        }),
        new Webpack.HotModuleReplacementPlugin()
    ]
};
